<template>
  <!-- ------------承运合同管理--------------- -->
  <div class="app-container">
    <!-- -----------------搜索区----------------- -->
    <div class="filter-container">
      合同标题：
      <el-input
        v-model="search.a_c_name"
        placeholder="合同标题"
        class="filter-item search_input"
        @keyup.enter.native="page1SearchPageList"
      />
      货主单位：
      <el-input
        v-model="search.a_unit"
        placeholder="货主单位"
        class="filter-item search_input"
        @keyup.enter.native="page1SearchPageList"
      />
      货主负责人：
      <el-input
        v-model="search.a_principal"
        placeholder="货主负责人"
        class="filter-item search_input"
        @keyup.enter.native="page1SearchPageList"
      />
      经办人：
      <el-input
        v-model="search.a_chartered"
        placeholder="经办人"
        class="filter-item search_input"
        @keyup.enter.native="page1SearchPageList"
      />
      签订日期：
      <el-date-picker v-model="search.a_conclude" type="date" placeholder="选择签订日期">
      </el-date-picker>
      审批状态： 
      <el-select v-model="search.a_c_status" placeholder="请选择活动区域">
      <el-option label="待审批" value="待审批"></el-option>
      <el-option label="已审批" value="已审批"></el-option>
      <el-option label="全部" value=" "></el-option>
    </el-select>
     
      <el-button
        class="filter-item"
        type="primary"
        icon="el-icon-search"
        @click="page1SearchPageList"
      >
        搜索
      </el-button>
      <el-button
        class="filter-item"
        style="margin-left: 10px"
        type="primary"
        icon="el-icon-edit"
        @click="ddtCreateShow"
      >
        添加
      </el-button>
      <el-button type="success" @click="Waipidelete()">批删</el-button>
    </div>
 <!-- ----------------显示部分-------------- -->
    <el-table
      ref="Accept"
      :data="tableData"
      tooltip-effect="dark"
      style="width: 100%"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column label="合同编号" width="120">
        <template slot-scope="scope">{{ scope.row.id }}</template>
      </el-table-column>
      <el-table-column prop="a_c_name" label="合同标题" width="120">
      </el-table-column>
      <el-table-column prop="a_unit" label="货主单位" show-overflow-tooltip>
      </el-table-column>
      <el-table-column
        prop="a_principal"
        label="货主负责人"
        show-overflow-tooltip
      >
      </el-table-column>
      <el-table-column prop="a_line" label="线路" show-overflow-tooltip>
      </el-table-column>
      <el-table-column
        prop="a_ton_freight"
        label="吨运险"
        show-overflow-tooltip
      >
      </el-table-column>
      <el-table-column
        prop="a_chartered_freight"
        label="包车条件吨位"
        show-overflow-tooltip
      >
      </el-table-column>
      <el-table-column
        prop="a_chartered_maney"
        label="包车金额"
        show-overflow-tooltip
      >
      </el-table-column>
      <el-table-column prop="a_conclude" label="签订日期" show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="a_chartered" label="经办人" show-overflow-tooltip>
      </el-table-column>
      <el-table-column
        prop="creationTime"
        label="创建时间"
        show-overflow-tooltip
      >
      </el-table-column>
      <el-table-column prop="a_c_status" label="状态" show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="a_c_approver" label="审批人" show-overflow-tooltip>
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        width="230"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.row.id)"
            >编辑</el-button
          >
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(scope.row.id)"
            >删除</el-button
          >
           <!-- <el-button
            size="mini"
            type="primary"
            @click="handleSelect(scope.row.id)"
            >查看</el-button
          > -->
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="search.page"
      :limit.sync="search.maxResultCount"
      :pageSizes="[2, 4, 6, 8]"
      @pagination="searchPageList"
    />           
    <!--添加弹出层-->
    <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible">
      <div>
        <el-form ref="form" :model="cheaddList" label-width="80px">
          <el-row>
            <el-col :span="8">
              <el-form-item label="合同标题">
                <el-input
                  v-model="cheaddList.a_c_name"
                  placeholder="合同标题"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="货主单位">
                <el-input
                  v-model="cheaddList.a_unit"
                  placeholder="货主单位"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="8">
              <el-form-item label="货主负责人">
                <el-input
                  v-model="cheaddList.a_principal"
                  placeholder="货主负责人"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="线路">
                <el-input
                  v-model="cheaddList.a_line"
                  placeholder="线路"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="8">
              <el-form-item label="吨运价">
                <el-input
                  v-model="cheaddList.a_ton_freight"
                  placeholder="吨运价"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="包车条件吨位：">
                <el-input
                  v-model="cheaddList.a_chartered_freight"
                  placeholder="包车条件吨位"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="8">
              <el-form-item label="包车金额">
                <el-input
                  v-model="cheaddList.a_chartered_maney"
                  placeholder="包车金额"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="经办人">
                <el-input
                  v-model="cheaddList.a_chartered"
                  placeholder="经办人"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="签订时间">
                <el-input
                  type="date"
                  v-model="cheaddList.a_conclude"
                  placeholder="签订时间"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="合同金额">
                <el-input
                  v-model="cheaddList.a_maney"
                  placeholder="合同金额"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="16">
              <el-form-item label="合同标的或项目说明：">
                <el-input
                  type="textarea"
                  v-model="cheaddList.a_project_explain"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="16">
              <el-form-item label="合同主要条款/变更条款：">
                <el-input
                  type="textarea"
                  v-model="cheaddList.a_clause"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="16">
              <el-form-item label="合同文本（附件）：">
                <el-upload
                  class="upload-demo"
                  :action="uploadUrl"
                  multiple
                  :on-success="handleAvatarSuccess2"
                  name="fileList"
                  :show-file-list="false"
                >
                  <el-button size="small" type="primary">点击修改</el-button>

                  <div slot="tip" class="el-upload__tip">
                    只能上传jpg/png文件，且不能查过500k
                  </div>
                </el-upload>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item>
            <el-button type="primary" @click="cheAddyes()">添加</el-button>
            <el-button @click="cheQu()">取消</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
    <!-- ----------------修改弹框-------------- -->
    <div>
      <el-dialog :title="dialogTitle" :visible.sync="dialogVisible">
        <div>
          <el-form ref="form" :model="updatefrom" label-width="80px">
            <el-row>
              <el-col :span="8">
                <el-form-item label="合同标题">
                  <el-input
                    v-model="updatefrom.a_c_name"
                    placeholder="合同标题"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="货主单位">
                  <el-input
                    v-model="updatefrom.a_unit"
                    placeholder="货主单位"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <el-form-item label="货主负责人">
                  <el-input
                    v-model="updatefrom.a_principal"
                    placeholder="货主负责人"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="线路">
                  <el-input
                    v-model="updatefrom.a_line"
                    placeholder="线路"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <el-form-item label="吨运价">
                  <el-input
                    v-model="updatefrom.a_ton_freight"
                    placeholder="吨运价"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="包车条件吨位：">
                  <el-input
                    v-model="updatefrom.a_chartered_freight"
                    placeholder="包车条件吨位"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <el-form-item label="包车金额">
                  <el-input
                    v-model="updatefrom.a_chartered_maney"
                    placeholder="包车金额"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="经办人">
                  <el-input
                    v-model="updatefrom.a_chartered"
                    placeholder="经办人"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="签订时间">
                  <el-input
                    type="datetime"
                    v-model="updatefrom.a_conclude"
                    placeholder="签订时间"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="合同金额">
                  <el-input
                    v-model="updatefrom.a_maney"
                    placeholder="合同金额"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="16">
                <el-form-item label="合同标的或项目说明：">
                  <el-input
                    type="textarea"
                    v-model="updatefrom.a_project_explain"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="16">
                <el-form-item label="合同主要条款/变更条款：">
                  <el-input
                    type="textarea"
                    v-model="updatefrom.a_clause"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="16">
                <el-form-item label="合同文本（附件）：">
                  <el-upload
                    class="upload-demo"
                    :action="uploadUrl"
                    multiple
                    :on-success="handleAvatarSuccess2"
                    name="fileList"
                    :show-file-list="false"
                  >
                    <el-button size="small" type="primary">点击修改</el-button>

                    <div slot="tip" class="el-upload__tip">
                      只能上传jpg/png文件，且不能查过500k
                    </div>
                  </el-upload>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item>
              <el-button type="primary" @click="AcceptUpdate()">修改</el-button>
              <el-button @click="cheQu()">取消</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import {
 AcceptConGetAll,
  AcceptConGet,
  PositionValidatorId,
  AcceptConCreated,
 AcceptConUpdate,
  AcceptConDelets,
  Acceptdeletes
} from "@/api/system_base/Contract_management/AcceptContractManagement"; // 引入职位

import Pagination from "@/components/Pagination"; // 引入分页组件

export default {
  components: { Pagination },
  data() {
    return {
      uploadUrl:
        process.env.VUE_APP_BASE_API +
        "services/app/FileManagerService/FilesUpload",
      imageUrl: "",
      addtuname: "",
      // 验证配置
      rules: {
        p_name: [
          { required: true, message: "请输入部门名称", trigger: "change" }, // 验证是否为空
        ],
        dep_up_description: [{ required: true, message: "请输入上级部门" }],
      },
      list: null, //表格绑定数据
      listLoading: true, //是否显示加载提示
      total: 0, //总行数

      //查询对象
      search: {
        page: 1, //当前页
        maxResultCount: 2, //每页多少条
        skipCount: 0, //当前页第一条记录位置  用于abp接口
        a_c_name: "", //职位名称
        a_unit:"",
        a_principal:"",        
        a_c_status:""

      },

      dialogFormVisible: false, // 是否显示添加弹出层
      dialogTitle: "", // 弹出层标题
      dialogStatus: "1", // 等于1 表示是添加操作   不等于1 表示修改操作
      dicTypInfo: {},
      form: {},
      //修改弹框
      dialogVisible: false,
      //显示数组
      tableData: [],
      //多选的值存储
      multipleSelection: [],
      //添加对像
      cheaddList: {
        a_c_name: "",
        a_unit: "",
        a_principal: "",
        a_line: "",
        a_ton_freight: "",
        a_chartered_freight: "",
        a_chartered_maney: "",
        a_chartered: "",
        a_conclude: "",
        a_maney: "",
        a_project_explain: "",
        a_clause: "",
       a_contract_text: "",
        a_c_status: "未审核",
        a_c_approver: "zmy",
      },
      uploadur1: "",
      handleAvatarsuccess2: "",
      //反天数组
      updatefrom:{
        a_conclude:""
      }
    };
  },
  created() {
    this.resetDicinfo(); //初始化model
    this.searchPageList();
  },
  methods: {
    //文件上传
    handleAvatarSuccess2(res, files, fileList) {
      // res.imagerUrl="https://localhost:44311/"+
      res.result.some((f, i) => {
        console.log("res", f);
        var that = this;
        that.addtuname = f.fileNewName;
        this.imagerUrl = "https://localhost:44311/" + f.fileNewName;
      });
    },
    handleClick(row) {
      console.log(row);
    },
    //删除
    handleDelete(dd) {
      if (confirm("确定删除？")) {
       AcceptConDelets(dd).then((response) => {
          this.$notify({
            title: "删除合同成功",
            message: "删除合同成功",
            type: "success",
            duration: 2000,
          });
          this.searchPageList();
        });
      }
    },
    // 搜索方法
    searchPageList() {
      this.listLoading = true; // 显示加载效果

      this.search.skipCount =
        (this.search.page - 1) * this.search.maxResultCount;

      AcceptConGetAll(this.search).then((response) => {
        // 调用分页接口
        this.tableData = response.result.items; // 将查询结果赋值给list
        this.listLoading = false; // 隐藏加载效果
        this.total = response.result.totalCount; // 赋值总行数
      });
    },
    page1SearchPageList() {
      // 点击搜索
      // 搜索方法
      this.search.page = 1; // 将当前页设置为第一页
      this.searchPageList(); // 调用搜索分页方法
    },
    resetDicinfo() {
      // 初始化用户对象
      this.dicTypInfo = {
        dep_name: "",
        dep_up_description: "",
      };
    },
    ddtCreateShow() {
      //弹出添加页面
      this.resetDicinfo();
      this.dialogStatus = "1"; // 等于1 表示是添加操作   不等于1 表示修改操作
      this.dialogTitle = "添加";
      this.dialogFormVisible = true; // 当等于true  弹出层显示
      this.$nextTick(() => {});
    },
    //添加方法
    cheAddyes() {
      // if (valid) {
      this.cheaddList.a_contract_text = this.addtuname;
        if(this.cheaddList.a_c_name=="")
      {
        this.$message("合同标题不能空");
        return;
      }
        if(this.cheaddList.a_unit=="")
      {
        this.$message("货主单位不能空");
        return;
      }
        if(this.cheaddList.a_principal=="")
      {
        this.$message("货主负责人不能空");
        return;
      }
        if(this.cheaddList.a_line=="")
      {
        this.$message("线路不能空");
        return;
      }
        if(this.cheaddList.a_ton_freight=="")
      {
        this.$message("吨位价不能空");
        return;
      }
    
        if(this.cheaddList.a_chartered_maney=="")
      {
        this.$message("包车金额不能空");
        return;
      }
        if(this.cheaddList.a_chartered=="")
      {
        this.$message("经办人不能空");
        return;
      }
        if(this.cheaddList.a_conclude=="")
      {
        this.$message("签订时间不能空");
        return;
      }
     AcceptConCreated(this.cheaddList).then((response) => {
        this.dialogFormVisible = false;
        this.searchPageList();
      
        this.$notify({
          title: "添加合同成功",
          message: "添加合同成功",
          type: "success",
          duration: 2000,
        });
      });
      // }
    },
    //修改弹出层显示
    handleEdit(dd) {
      this.dialogVisible = true;
      AcceptConGet(dd).then((r) => {
        this.updatefrom=r.result.a_conclude.substring(10,0);
        this.updatefrom = r.result;                       
      });
    },
    //货主合同修改
   AcceptUpdate() {
     AcceptConUpdate(this.updatefrom).then((r) => {
        this.dialogVisible = false;
        this.searchPageList();
        this.$notify({
          title: "修改职位成功",
          message: "修改职位成功",
          type: "success",
          duration: 2000,
        });
      });
    },
    //货主合同批删
    Waipidelete() {
      var arrid=[];
      var id=this.$refs.Accept.selection;
      id.forEach((r)=>{
        arrid.push(r.id);
      })
      if(confirm("确认删除吗"))
      {
        
        arrid.forEach((r)=>{
          Acceptdeletes(r).then(
          (r)=>{
           
          }
        )
         this.$message("批删成功");
            this.searchPageList();
        })
      }
    },
    //多选方法
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePreview(file) {
      console.log(file);
    },
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
      );
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    //查看
    handleSelect(){}
  },

};
</script>
<style >
.search_input {
  width: 200px; 
}
</style>
